<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/common/taglibs.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@include file="/common/header.jsp"%>
<title><s:text name="erp.system.common.login"></s:text></title>

<style type="text/css">
body {
	margin: 0;
	padding: 0;
	background: #190a23;
}	
#wrapper{
	position: relative;
	left: 50%;
	margin-left: -512px;
	width: 1024px;
	height: 600px;
	background: url(${ctx}/images/login/login_bg.jpg) no-repeat;
}
#loginName{
	position: absolute;
	width: 179px; 
	height: 21px;
	left: 528px;
	top: 204px;
}

#password{
	position: absolute;
	width: 179px; 
	height: 21px;
	left: 528px;
	top: 255px;
}

#verifyCode{
	position: absolute;
	width: 109px; 
	height: 21px;
	left: 528px;
	top: 305px;
}

#CreateCheckCode{
	position: absolute;
	width: 67px; 
	height: 30px;
	left: 654px;
	top: 305px;
}
#login{
	background: none repeat scroll 0 0 transparent;
    border: none;
    cursor: pointer;
    height: 31px;
    left: 540px;
    position: absolute;
    top: 362px;
    width: 73px;
    font-size: 0px;
}

#reset{
	background: none repeat scroll 0 0 transparent;
    border: none;
    cursor: pointer;
    height: 31px;
    left: 636px;
    position: absolute;
    top: 362px;
    width: 73px;
    font-size: 0px;
}

.loginError{
	color: red;
	position: absolute;
	left:527px; 
	top:177px;
	font-size: 18px;
}

.browserRecommend{
	color: #FFFFFF;
	position: absolute;
	width: 1024px;
	text-align: center;
	top: 500px;
}
.browserRecommend a{
	color: #ffffff;
	text-decoration: underline;
}

a{
	position: absolute;
	width: 45px; 
	height: 21px;
	left: 666px;
	top: 336px;
	cursor: pointer;
	text-decoration:none;
}	

select{
	position: absolute;
	left:527px;
	top:148px;
	width:145px;
	height:25px;
	font-size:12px;
}
</style>

<script type="text/javascript">
$(function(){
    if (window != top)
    {
        top.location.href = location.href; 
    }
});
function checkCodeReload() {  
    document.getElementById("CreateCheckCode").src = document  
            .getElementById("CreateCheckCode").src  
            + "?nocache=" + new Date().getTime();  
}  

function initOnLoad(){
	$('#loginName').focus();
}

function login(){
	$("#info").html("");
	var loginName = $('#loginName').val();
	var password = $('#password').val();
	var randCheckCode = $('#verifyCode').val();

	if(inputIsEmpty("loginName")){
		$("#info").html('<s:text name="erp.system.common.username.required"></s:text>');
		$('#loginName').focus();
		return false;
	};
	if(inputIsEmpty("password")){
		$("#info").html('<s:text name="erp.system.common.password.required"></s:text>');
		$('#password').focus();
		return false;
	};
	if(inputIsEmpty("verifyCode")){
		$("#info").html('<s:text name="erp.system.login.verificationcode.required"></s:text>');
		$('#verifyCode').focus();
		return false;
	};
	
	$.ajax({
		type : "post",
		url : "${ctx}/system/login.action",
		data : {
			'loginName' : loginName,
			'password' : password,
			'randCheckCode':randCheckCode
		},
		//返回数据的格式
		datatype: "json",//"xml", "html", "script", "json", "jsonp", "html".

		beforeSend : function() {
			$('login').hide();
		},

		//成功返回之后调用的函数             
		success : function(data) {
			var resultValue = data.resultType;
			$("#password").val("");
			$('#verifyCode').val("");
      	    if(resultValue == "none"){
      		   $("#info").html('<s:text name="erp.system.common.username.noexist"></s:text>');
      		   $('#loginName').focus();
      		   checkCodeReload();
      	    }else if(resultValue == "input"){
      		   $("#info").html('<s:text name="erp.system.common.password.wrong"></s:text>');
      		   $('#password').focus();
      		 	checkCodeReload();
      	    }else if(resultValue == "checkCode"){
       		   $("#info").html('<s:text name="erp.system.login.verificationcode.wrong"></s:text>');
       		   $('#verifyCode').focus();
     		 	checkCodeReload();
     	    }else if(resultValue == "success"){
      		   window.location.href="${ctx}/system/toMain.action";
      	    }

		},

		complete : function() {
			$('login').show();
		},

		//调用出错执行的函数
		error : function() {
			//请求出错处理
			alert("error");/////////////////      
		}
	});	
}

function reset(){
	$('#loginName').val("");
	$('#password').val("");
	$('#verifyCode').val("");
	$("#info").html("");
	$('#loginName').focus();
}

function changeLan(){
	var lan = $("#lanId").val();
	if(lan != ""){
		window.location.href="${ctx}/language/changeLan.action?language="+lan;
	}
}

document.onkeypress = function(e){
	e = e || window.event;
	var keyCode = e.which || e.keyCode;
	if(keyCode==KEY_ENTER){
		$('#login').click();
	}
};
</script>

</head>
<body onload="javascript:initOnLoad();">

	<div id="wrapper">
			<select onchange="javascript:changeLan();" id="lanId">
				<option value="" selected="selected"><s:text name="erp.system.login.changeversion"></s:text></option>
				<option value="en_US" <c:if test="${language eq 'en_US'}">selected="selected"</c:if>>English(US)</option>
				<option value="zh_CN" <c:if test="${language eq 'zh_CN'}">selected="selected"</c:if>>简体中文(中国大陆)</option>
			</select>
			
			<span class="loginError" id="info"></span>
			
			<!-- 用户名 -->
			<div style="position: absolute;left:452px;top:211px;width: 80px;" align="right">
				<font color="blue"><strong><s:text name="erp.system.common.username"></s:text></strong>：</font>
			</div>
	   		<input id="loginName" name="loginName" type="text">
	   		
	   		<!-- 密码 -->
	   		<div style="position: absolute;left:452px;top:263px;width: 80px;" align="right">
				<font color="blue"><strong><s:text name="erp.system.common.password"></s:text></strong>：</font>
			</div>
	   		<input id="password" name="password" type="password">
	   		
	   		<!-- 验证码 -->
	   		<div style="position: absolute;left:452px;top:312px;width: 80px;" align="right">
				<font color="blue"><strong><s:text name="erp.system.common.verificationcode"></s:text></strong>：</font>
			</div>
	   		<input id="verifyCode" name="verifyCode" type="text">
	   		 <img src="${ctx}/servlet/PictureCheckCode" id="CreateCheckCode" align="middle">  
            <a id="checkCode" onclick="javascript:checkCodeReload();"><s:text name="erp.system.login.changecode"></s:text></a>

			<!-- 登录 -->
	   		<div style="position: absolute;left:540px;top:362px;width: 73px;height: 31px;line-height: 31px;" align="center">
				<font color="white"><strong><s:text name="erp.system.common.login"></s:text></strong></font>
			</div>
			<!-- 重置 -->
	   		<div style="position: absolute;left:636px;top:362px;width: 73px;height: 31px;line-height: 31px;" align="center">
				<font color="white"><strong><s:text name="erp.system.common.reset"></s:text></strong></font>
			</div>
	   		<input id="login" name="login" src="<w:path/>resources/img/touming.gif" onclick="javascript:login();">
	   		<input id="reset" name="reset" src="<w:path/>resources/img/touming.gif" onclick="javascript:reset();">
	</div>
</body>
</html>